<template>
	<view class="content">
		<view class="content-title">
			<span style="margin-right:5rpx;">·</span>{{list.activity ? list.activity : ''}}<span style="margin-left:5rpx;">·</span>
		</view>
		<view class="illustrate">
			{{list.titles ? list.titles : ''}}
		</view>
		<view class="illustrate-aside">
			<view class="aside-one">
				{{list.full?list.full :''}}
			</view>
			<view class="aside-two">
				{{list.one ? list.one :''}}
			</view>
			<view class="aside-three">
				{{list.first ?  list.first :''}}
			</view>
			<view class="aside-one">
				{{list.enjoy ?list.enjoy :''}}
			</view>
			<view class="aside-two">
				{{list.is_one?list.is_one:''}}
			</view>
			<view class="aside-three">
				{{list.title ?list.title :''}}
			</view>
			<view class="aside-two">
				{{list.three ?list.three :''}}
			</view>
			<view class="aside-three">
				{{list.first ?list.first :'' }}
			</view>
		</view>
		<view class="cycle">
				{{list.cycle ?list.cycle :''}}
		</view>
		<view class="time">
			{{list.info ? list.info:''}}
		</view>
		<view class="tips">
			{{list.count ? list.count :''}}
		</view>
		<view class="buttons" v-if="show" @click="btnFn" :style="background ? background : ''">
			{{list.join ? list.join :''}}
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			  list:{
				  
			  },
			  bottomPopup:{
				  
			  },
			  background:null ,
			  show:false,
			  
			}
		},
		onShow(){
			this.getlist();
		},
		methods: {
			getlist(){
			this.$u.api.getjindong({	
			}).then(res => {
				if (res.return_code == '200') {
					this.list = res.data.list;
					this.show = res.data.halfsiza_applet.open == 1;
					this.background = res.data.list.color;
					this.bottomPopup = res.data.halfsiza_applet;
					uni.setNavigationBarTitle({
							title: res.data.list.top_title
						});	
				};
			
			}).catch(err => {})
			
			},
			// 0不跳转 1本地 2 H5  3跳转小程序 
			btnFn(){
				let that = this;
				that.$u.api.getAward({type:23}).then(re => {
				
				}).catch(() => {});
				if (that.bottomPopup.type == 0) {
					that.bottomPopupShow = false;
				} else if (that.bottomPopup.type == 1) {
					uni.navigateTo({
						url: that.bottomPopup.self_url,
					});
				} else if (that.bottomPopup.type == 2) {
					this.$utils.jumpWebview(that.bottomPopup.url);
					/* uni.navigateTo({
						url: "/pages/webview/index?url=" + that.bottomPopup.url
					}) */
				} else if (that.bottomPopup.type == 3) {
					uni.navigateToMiniProgram({
						appId: that.bottomPopup.car_shop_appid,
						path: that.bottomPopup.url_platform,
						extraData: {
							'data1': 'test'
						},
						success(res) {
							console.log(that,'this');
							that.$u.api.getChargings({appid: that.bottomPopup.car_shop_appid,
						appPath: that.bottomPopup.url_platform,}).then(res => {
							});			
							
							// 打开成功
						}
					})
				}
			}
		}
	}
</script>
<style>   
      page{height:100%;background:#000} 
</style>
<style scoped>
	.content{
		position: relative;
		overflow: hidden;
		width: 750rpx;
		height: 1490rpx;
		background: url(https://imageapi.cd1a.cn/uni/webview/jindongbg.jpg) no-repeat;
		background-size: 100% 100%;
	}
	.content-title{
		margin-top: 772rpx;
		width: 100%;
		text-align: center;
		font-size: 34rpx;
		font-weight: bold;
		color: #FFFFFF;
	}
	.illustrate {
		position: absolute;
		top: 875rpx;
		left: 110rpx;
		font-size: 28rpx;
		font-weight: 500;
		color: #FFFFFF;
	}
	.illustrate-aside {
		width: 100%;
		position: absolute;
		top: 935rpx;
		text-align: center;
	}
	.aside-one {
		margin-left: 5rpx;
	display: inline-block;
	width: 43rpx;
	height: 43rpx;
	background: #FBA852;
	border-radius: 50%;	
	font-size: 29rpx;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	line-height: 43rpx;
	}
	.aside-two {
		display: inline-block;
		font-size: 69rpx;
		font-weight: bold;
		color: #FF5443;
	}
	.aside-three {
		display: inline-block;
		font-size: 31rpx;
		font-weight: 400;
		color: #333333;
	}
	.cycle {
		position: absolute;
		top: 1059rpx;
		left: 110rpx;
		font-size: 28rpx;
		font-weight: 500;
		color: #FFFFFF;
	}
	.time {
		position: absolute;
		top: 1127rpx;
		width: 100%;
		font-size: 31rpx;
		font-weight: 400;
		text-align: center;
		color: #333333;
	}
	.tips{
		position: absolute;
		top: 1223rpx;
		width: 100%;
		height: 19rpx;
		font-size: 20rpx;
		text-align: center;
		font-weight: 400;
		color: #666666;
		line-height: 42rpx;	
	}
	.buttons {
		position: absolute;
		top: 1333rpx;
		left: 62rpx;
		width: 633rpx;
		height: 90rpx;
		/* background: linear-gradient(0deg, #F54649 20%, #FF9579 100%); */
		box-shadow: 0rpx 0rpx 54rpx 0rpx rgba(255,160,62,0.6);
		border-radius: 45rpx;
		text-align: center;
		line-height: 90rpx;
		font-size: 40rpx;
		font-weight: 500;
		color: #FFFFFF;
	}
</style>
